<template>
  <div class="main">
    <div class="searchBox clearfix">    	
    	<div class="searchContent">
    		<el-input
			  placeholder="业主名称"
			  v-model="param.name"
			  clearable>
			</el-input>
			<el-input
			  placeholder="手机号码"
			  v-model="param.phoneNumber"
			  clearable>
			</el-input>			
			<el-button @click="tableList">查找</el-button>    		
    	</div>    	
    </div>
    <div class="tableList">
	    <el-table :data="list.rows" style="width: 100%" row-key="id" border  >
	        <el-table-column label="姓名"  > 
	           <template slot-scope="scope" >
	                <span>{{ scope.row.name }}</span>
	            </template>           
	        </el-table-column>        
	        <el-table-column label="手机号" >
	            <template slot-scope="scope">
	                <span>{{ scope.row.phoneNumber }}</span>
	            </template>
	        </el-table-column>	      
	        <!-- <el-table-column label="身份证号码">
	            <template slot-scope="scope">
	                <span>{{ scope.row.documentNumber }}</span>
	            </template>
	        </el-table-column>		          -->
	        <el-table-column label="创建时间">
	            <template slot-scope="scope">
	                <span>{{ scope.row.createTime }}</span>
	            </template>
	        </el-table-column>	                 
	    </el-table>
    </div>  
    <div class="pagination">   
         <el-pagination
            @size-change="changeNum"
            @current-change="changePage"
            :current-page="param.pageNum"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="param.pageSize"
            layout="total, prev, pager, next,sizes"
            :total="list.total">
        </el-pagination>
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex';
export default {
	name: 'ownerInfo',
	data () {
		return {
			// dialogShowImg:false,		
			idNum:'',
			url:'/system/user/page',
			param: {				
				name:null, 					                        	              
				phoneNumber:null, 
				userSystemTypeEnum:'CUSTOMER',
				statusEnum:null,
				pageNum: 1,
				pageSize: 10,                  	                	            
			},				  							
		}
	},
	methods: { 		
	    changeNum(val) {   
	 		this.param.pageNum=1;        
	        this.param.pageSize = val; 
	        this.$store.dispatch('getlist',{param:this.param,url:this.url});       
	    },
	    changePage(val) { 
	        this.param.pageNum=val;   
	       this.$store.dispatch('getlist',{param:this.param,url:this.url});       
	       
	    }, 
	    tableList(){
	    	this.$store.dispatch('getlist',{param:this.param,url:this.url}); 
	    },	  	    
	},
	created() {   	
       this.$store.dispatch('getlist',{param:this.param,url:this.url});              
	},
	computed:{
    	...mapState(['list'])
    } 
}
</script>
<style scoped>

</style>
